﻿@model Tau.ViewModels.PageList

<style>
    .ui-state-highlight { height: 1.5em; line-height: 1.2em; }
</style>

<script type="text/javascript">
	$(function () {
	    $("ul.droptrue").sortable({
	        connectWith: "ul"
	    }).disableSelection();
	});
</script>

<table>
    <tr>
        <!--HOME - this is static-->
        <td align="left" valign="middle" colspan="2">
            Home
        </td>

        @{
            //get all top-level pages
            var parentPages = Model.Pages.FindAll(pp => pp.ParentPageId == 0 && pp.PageId != 314); //exclude HOME

            foreach (var page in parentPages)
            {
                <td width="30px">
                    @Html.TextBox("order_" + page.PageId, page.OrderId, new { style = "width:25px" })
                </td>
                <td align="left" valign="middle">
                    @page.PageTitle 
                    @if (!page.HasChildren)
                    {
                        <a href="javascript:;" onclick="deletePage(@page.PageId, true);" style="cursor:pointer; font-size:x-small">delete</a> 
                    }
                </td>   
            }
        }
    </tr>
    
        
    <tr>
         <!--Home Page - static-->
         <td valign="top" colspan="2">
             <ul style="list-style-type: none; margin: 0; padding: 0; float: left; margin-right: 10px; background: #eee; padding: 5px; width: 143px;">
                      
                <li class="ui-state-default" style="margin: 0 5px 5px 5px; padding: 5px; font-size: 1em; width: 115px;">
                    Home Page <br />
                                    
                    <a href='@Url.Action("GetPage", "Page", new { id = 314, area = "" })' target="_blank" style="cursor:pointer; font-size:x-small">view</a> |
                    <a href="javascript:;" onclick="popupAddEdit(314);" style="cursor:pointer; font-size:x-small">edit</a> 
                </li>

            </ul>
        </td>

        @{
            foreach (var page in parentPages)
            {
                <td valign="top" colspan="2">
                       
                    <ul id="@page.PageId" class="droptrue" style="list-style-type: none; margin: 0; padding: 0; float: left; margin-right: 10px; background: #eee; padding: 5px; width: 143px;">
                        
                        @{ 
                            //get all child pages
                            var children = Model.Pages.FindAll(pp => pp.ParentPageId == page.PageId && pp.PageId != 314);

                            foreach (var childPage in children)
                            {
                    
                                <li class="ui-state-default" id="@childPage.PageId" style="margin: 0 5px 5px 5px; padding: 5px; font-size: 1em; width: 115px; cursor:move">
                                    @childPage.PageName <br />
                                    
                                    <a href='@Url.Action("GetPage", "Page", new { id = childPage.PageId, area = "" })' target="_blank" style="cursor:pointer; font-size:x-small">view</a> |
                                    <a href="javascript:;" onclick="popupAddEdit(@childPage.PageId);" style="cursor:pointer; font-size:x-small">edit</a> |
                                    <a href="javascript:;" onclick="deletePage(@childPage.PageId);" style="cursor:pointer; font-size:x-small">delete</a> 
                                </li>
                            }      
                        }

                    </ul>
                </td>
            }
        }
    </tr>
</table>